<template>
	<view class="u-margin-left-26 u-margin-right-26">
		<u-form ref="uForm" :model="user">
			<u-form-item left-icon="account" label-width="120" label-position="left" label="账号" prop="zhanghao">
				<u-input placeholder="请输入账号" type="text" v-model="user.zhanghao"></u-input>
			</u-form-item>
			<u-form-item left-icon="lock" label-width="120" label-position="left" label="密码" prop="mima">
				<u-input type="password" placeholder="请输入密码" v-model="user.mima"></u-input>
			</u-form-item>
			<u-form-item label="记住密码" label-width="150">
				<u-switch class="u-pointer-area" slot="right" v-model="checked"></u-switch>
			</u-form-item>
		</u-form>
		<u-button @click="submit">提交</u-button>
		<!-- <u-link class="u-pointer-area" :under-line=true font-size=10 @click="submit" href="http://www.baidu.com">注册</u-link> -->
		<view class="space-between">
			<view @click="goRegister" class="link">尚未注册？</view>
			<view class="link">忘记密码？</view>
		</view>
		<u-toast ref="uToast">
		</u-toast>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				checked: false,
				user: {
					zhanghao: "",
					mima: ""
				},
				rules: {
					zhanghao: [{
						required: true,
						message: "账号不能为空！",
						trigger: ["blur"]
					}]
				}
			}
		},
		onLoad() {

		},
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
		methods: {
			submit() {
				uni.request({
					url: "http://localhost:9090/doLogin",
					data: this.user,
					method: "POST",
					success: (res) => { //向后端发送请求
						if (res.data.code*1 == 201) {
							//登录失败
							this.$u.toast('账户或密码错误！') //提示框
						} else {
							//登录成功
							uni.setStorageSync("user", res.data.result) //存数据
							uni.switchTab({
								url:"/pages/ZYX/myinfo"
							})
						}
					}
				})
			},
			goRegister() {
				uni.navigateTo({
					url:"/pages/ZYX/register"
				})
			}
		},
	}
</script>

<style>
	.u-pointer-area {
		cursor: pointer;
	}
	.space-between {
		display: flex;
		justify-content:space-between;
		margin-top: 30rpx;
	}
	.link {
		color: #0000FF;
		cursor: pointer;
	}
</style>